<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <div th:replace="common/publicJs::common_header"></div>
    <style>
        .navigation{
            font-size: 22px;
            margin-bottom: 5px;
        }
    </style>
    <script>
        $(function () {

            $.extend($.fn.validatebox.defaults.rules, {
                /*必须和某个字段相等*/
                equalTo: {
                    validator: function (value, param) {
                        return $(param[0]).val() == value;
                    },
                    message: '两次输入密码不匹配'
                }
            });

            // 用户所属机构选择框
            $("#orgId").combotree({
                url: ctx + 'sys/org/all',
                id: 'id',
                textField: 'name',
                parentField: 'parentId',
                label: '所属机构:',
                labelAlign: 'right',
                disabled:true,
                hasDownArrow:false
            })

            //出生日期框
            var buttons = $.extend([], $.fn.datebox.defaults.buttons);
            buttons.push({
                text: '清空',
                handler: function(target){
                    $('#birthday').datebox('setValue', '');
                    $('#birthday').datebox('hidePanel');
                }
            });
            $('#birthday').datebox({
                labelAlign: 'right',
                buttons:buttons,
                editable: false
            });

            // 性别框
            $('#sex').combobox({
                valueField: 'value',
                textField: 'name',
                labelAlign: 'right',
                panelHeight:120,
                editable : false,
                data: [
                    {
                        name: '男',
                        value: '1'
                    },{
                        name: '女',
                        value: '0'
                    },{
                        name: '未知',
                        value: '2'
                    }
                ]
            });
        });

        function clearParentId() {
            $('#parentId').combotree('clear');
        }

        function subForm() {
            $.messager.progress({
                title: '提示',
                text: '数据处理中，请稍后....'
            });
            // $.messager.progress();
            $("#entityForm").form('submit', {
                onSubmit: function () {
                    var isValid = $(this).form('validate');
                    if (!isValid) {
                        $.messager.progress('close');	// hide progress bar while the form is invalid
                    }
                    return isValid;	// return false will stop the form submission
                },
                success:function (result) {
                    // console.log(result);
                    result = eval('(' + result + ')');
                    $.messager.progress('close');
                    $.messager.alert('提示',result.msg,'info');
                    if (result.code == 0) {
                        $('#form').dialog('close');
                        //删除datagrid的选中状态，否则上次操作的缓存会存在
                        $("#datagrid").datagrid('clearSelections');
                        $('#datagrid').datagrid("reload");
                    }
                }
            })
        }

        /**
         * 关闭dialog框
         */
        function closeForm() {
            $('#form').dialog('close');
        }
    </script>
</head>
<body class="easyui-layout">

    <!-- 左侧导航项 -->
    <div data-options="region:'west'"  style="width:200px;">
        <a href="#baseInfo" style="text-decoration:none"><div class="navigation">基本信息</div></a>
        <a href="#pwd" style="text-decoration:none"><div class="navigation">密码</div></a>
    </div>

    <!--中部区域-->
    <div data-options="region:'center'">
        <form th:action="@{/sys/user/save}" id="entityForm"  th:object="${userEntity}" th:method="post" style="text-align: center;">
            <input type="hidden" th:field="*{id}">
            <div style="margin-bottom: 10px"></div>
            <div style="margin-bottom: 10px">
                <input th:field="*{name}" class="easyui-textbox" data-options="required:true,label:'姓名:'" style="width:40%"/>
            </div>
            <div style="margin-bottom: 10px">
                <input th:field="*{loginName}" class="easyui-textbox" data-options="label:'登录名:'" disabled="disabled" style="width:40%">
            </div>
            <div style="margin-bottom: 10px">
                <!--所属机构 -->
                <input th:field="*{orgId}"  style="width:40%">
                <!--            <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-no'" onclick="clearParentId()">清除</a>-->
            </div>
            <div style="margin-bottom: 10px">
                <input th:field="${userEntity.password}" class="easyui-passwordbox" data-options="label:'密码'" style="width:40%"/>
            </div>

            <div style="margin-bottom: 10px">
                <input th:value="${userEntity.password}" class="easyui-passwordbox" data-options="label:'确认密码'"
                       validType="equalTo['#password']"  style="width:40%"/>
            </div>

            <div style="margin-bottom: 20px">
                <input th:field="*{birthday}" class="easyui-textbox" data-options="label:'生日'" style="width:40%"/>
            </div>
            <div style="margin-bottom: 20px">
                <input th:field="*{sex}" class="easyui-textbox" data-options="label:'性别'" style="width:40%"/>
            </div>
            <div style="margin-bottom: 20px">
                <input th:field="*{phoneNumber}" class="easyui-textbox" data-options="label:'电话号码'" style="width:40%"/>
            </div>
            <div style="margin-bottom: 20px">
                <input th:field="*{email}" class="easyui-textbox" data-options="label:'邮箱'" style="width:40%"/>
            </div>
            <!--<div style="margin-bottom: 20px">
                <input th:field="*{status}" class="easyui-textbox" data-options="label:'状态'" style="width:40%"/>
            </div>-->
            <a name="baseInfo"></a>

            <div style="margin-bottom:20px;text-align: center">
                <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-save'" onclick="subForm()">保 存</a>
                <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-undo'" onclick="closeForm()">返回</a>
            </div>
        </form>
    </div>

</body>
</html>